<template>
  <div>
    <div class="chat-style">
      <div class="horizontal-style">
        <Input v-model="countriesNumber" maxlength="3" style="width: 80px">
          <span slot="prepend">+</span>
        </Input>
        <Input v-model="phoneNumber" :placeholder="$t('lang.inputNumberSession')" maxlength="11">
        </Input>
        <Button class="button-session" type="primary" @click="addNewChat">{{ $t('lang.initiateSession') }}
        </Button>

      </div>
      <div style="margin-top: 20px">
        <span style="color: black">{{userName}}</span>
        <Button class="button-session" type="primary" @click="reLoad">Refresh</Button>

      </div>
    </div>
  </div>

</template>

<script>
const {ipcRenderer} = window.require("electron");
export default {
  name: "Right",
  data() {
    return {
      userName:localStorage.userName,
      footerHide: true,
      viewId: "",
      loginAccount: '',
      chatUser: '',
      videoSrc: '',
      videoImg: '',
      isPlay: false,
      width: '300',
      height: '300',
      preload: 'auto',
      controls: true,
      autoplay: false,

      groupingDialogVisible: false,
      replyDialogVisible: false,
      replyFastDialogVisible: false,
      loading: false,
      defaultSort: '1',
      tabsValue: "name1",
      activeName: 'first',
      userPortraitList: [],
      phoneNumber: "",
      countriesNumber: "91",
      switchStatus: false,
      checkedHobbys: [],
      sexValue: '',
      groupingSortList: [],
      defaultSortList: [],
      groupingValue: '',
      groupingCode: '',
      replyTitleValue: '',
      replyFastCode: '',
      replyGroupCode: '',
      replyGroupingValue: '',
      replyContentValue: '',

      //任务相关参数
      taskSize: 0,
      taskDetail: '1',
      recordValue: '',
      taskDialogVisible: false,
      taskBind: false,
      taskList: [],
      taskUserList: [],
      taskSexValue: '',
      taskCheckedHobbys: [],
      currentTaskPosition: 0,
      atHisTableValue: '',
      atHisTableList: [],
      taskListDialogVisible: false,
      taskRecordAllList: [],
      allRecordSearchList: [],
      taskRecordFileList: [],
      fileRecordSearchList: [],
      taskRecordPicVideoList: [],
      videoDialogVisible: false,
      imageDialogVisible: false,
      imageUrl: '',


      translationGoalValue: '',
      translationResultValue: '',
      originalLanguageValue: 'en',
      resultLanguageValue: 'en',
      originalLanguageList: [],
      resultLanguageList: [],
      systemLanguageValue: '',
      translationLanguageValue: 'en',
      systemLanguageList: [],
      translationLanguageList: [],
      isCreat: false,
      taskCreateCode: '',
      currentTaskCode: '',
      originalVisible: false,
      resultVisible: false,
      translationVisible: false,
      initiateTaskContent: '',
      labelItems: [],
      editorLabelDialogVisible: false,
      labelList: [],
      labelVisible: false,
      isGroup: false

    }
  },
  methods: {
    initData() {
      this.userName = localStorage.userName
      this.taskSize = 0
      this.taskDetail = '1'
      this.recordValue = ''
      this.taskList = []
      this.taskUserList = []
      this.taskSexValue = ''
      this.taskCheckedHobbys = []
      this.currentTaskPosition = 0
      this.atHisTableValue = ''
      this.atHisTableList = []
      this.taskRecordAllList = []
      this.allRecordSearchList = []
      this.taskRecordFileList = []
      this.fileRecordSearchList = []
      this.taskRecordPicVideoList = []
      this.imageUrl = ''
      this.defaultSort = '1'
      if (this.isGroup) {
        this.tabsValue = "name2"
      } else {
        this.tabsValue = "name1"
      }
      this.activeName = 'first'
      this.userPortraitList = []
      this.phoneNumber = ""
      this.checkedHobbys = []
      this.sexValue = ''
      this.initiateTaskContent = ''
      this.labelList = []
      this.labelItems = []
      this.labelVisible = false
      this.editorLabelDialogVisible = false
      if (this.originalVisible) {
        this.$refs.originalSelect.blur()
      }
      if (this.resultVisible) {
        this.$refs.resultSelect.blur()
      }
      if (this.translationVisible) {
        this.$refs.translationSelect.blur()
      }
    },
    editorLabel() {
      this.getUserLabels()
    },
    editorLabelClick() {
      if (this.labelList.length > 0) {
        let editorList = []
        for (let i = 0; i < this.labelList.length; i++) {
          editorList.unshift({
            labelCode: this.labelList[i].labelCode,
            values: this.labelList[i].value,
            type: this.labelList[i].type
          })
        }
        this.$api.getUserLabelsEditing({
          list: editorList,
          userWaAccount: this.chatUser
        }).then(() => {
          this.$message({
            message: this.$t('lang.userLabelEditorSuccess'),
            type: 'success'
          })
          this.getLabelsShowList()
          this.editorLabelDialogVisible = false
        })
      } else {
        this.editorLabelDialogVisible = false
      }

    },
    getUserLabels() {
      this.$api.getUserLabels({
        userWaAccount: this.chatUser
      }).then(res => {
        if (res === null) return
        this.labelList = res.labelList
        this.editorLabelDialogVisible = true

      })
    },
    getLabelsShowList() {
      this.$api.getLabelsShowList({
        userWaAccount: this.chatUser
      }).then(res => {
        if (res.dataList === null) return
        this.labelVisible = true
        this.labelItems = res.dataList
      })
    },
    originalVisibleChange(bool) {
      this.originalVisible = bool
    },
    resultVisibleChange(bool) {
      this.resultVisible = bool
    },
    translationVisibleChange(bool) {
      this.translationVisible = bool
    },
    tabClick() {
      this.recordValue = ''
      this.allRecordSearchList = this.taskRecordAllList
      this.fileRecordSearchList = this.taskRecordFileList
    },
    recordInput(queryString) {
      if (this.activeName === 'first') {
        let restaurants = this.taskRecordAllList
        this.allRecordSearchList = restaurants.filter(function (arrayFilter) {
          return arrayFilter.messageContent.search(queryString) !== -1;
        })
      } else if (this.activeName === 'second') {
        let restaurants = this.taskRecordFileList
        this.fileRecordSearchList = restaurants.filter(function (arrayFilter) {
          return arrayFilter.cmessageContentontent.search(queryString) !== -1;
        })
      }

    },
    valueChange() {
      let left = this.originalLanguageValue
      let right = this.resultLanguageValue
      this.originalLanguageValue = right
      this.resultLanguageValue = left
    },
    videoPause() {
      let vide = document.getElementById("vide");
      if (vide.paused) {
        vide.play();
      } else if (vide.play()) {
        vide.pause();
      }
    },
    imagePreview(url) {
      this.imageUrl = url
      this.imageDialogVisible = true
    },
    onPlayerPlay(item) {
      this.videoSrc = item.url
      this.videoImg = item.face
      this.videoDialogVisible = true
    },
    downFile(index) {
      let url = this.fileRecordSearchList[index].downloadLink
      let name = this.fileRecordSearchList[index].fileName
      name = name.replace(/\s*/g, '')
      this.downloadByBlob(url, name)
    },
    downloadByBlob(data, name) {
      let blob = new Blob([data]);
      let url = window.URL.createObjectURL(blob);
      let aLink = document.createElement("a");
      aLink.style.display = "none";
      aLink.href = url;
      aLink.setAttribute("download", name);
      document.body.appendChild(aLink);
      aLink.click();
      document.body.removeChild(aLink); //下载完成移除元素
      window.URL.revokeObjectURL(url); //释放掉blob对象
    },
    download(href, name) {
      let eleLink = document.createElement('a')
      eleLink.download = name
      eleLink.href = href
      eleLink.click()
      eleLink.remove()
    },
    taskListJump() {
      this.taskListDialogVisible = true
    }
    ,
    forwardingAsyncOK() {
      let code
      if (this.taskCreateCode === '') {
        code = this.taskList[this.currentTaskPosition].taskCode
      } else {
        code = this.taskCreateCode
      }
      if (this.atHisTableValue !== '') {
        this.loading = true
        this.$api.getTaskTransport({
          targetAdminCode: this.atHisTableValue,
          taskCode: code
        }).then(() => {
          this.taskDialogVisible = false;
          this.loading = false
          this.$message({
            message: this.$t('lang.taskForwardingSuccessTip'),
            type: 'success'
          })
          this.taskCreateCode = ''
          this.initiateTaskContent = ''
          this.getSpecialUserTaskList()
        }).catch(() => {
          this.loading = false
        })
      } else {
        this.$message({
          message: this.$t('lang.taskSelectTableTip'),
          type: 'warning'
        })
      }

    }
    ,
    taskOver() {
      this.$confirm(this.$t('lang.overTaskTitle'), this.$t('lang.taskOverTask'), {
        confirmButtonText: this.$t('lang.sureTxt'),
        cancelButtonText: this.$t('lang.cancelTxt'),
        center: true,
      }).then(() => {
        this.getTaskComplete(this.taskList[this.currentTaskPosition].taskCode)
      }).catch(() => {

      });
    }
    ,
    bindTask(index, code) {
      this.getTaskCurrentTask(index, code)
    }
    ,
    taskDialogVisibleClick() {
      this.getOtherAdminList()
    },
    getOtherAdminList() {
      this.$api.getOtherAdminList({
        adminCode: localStorage.adminCode
      }).then((res = {}) => {
        if (res === null) return
        this.atHisTableList = res.dataList
        this.taskDialogVisible = true
      }).catch((error) => {
        this.$message({
          message: error,
          type: 'error'
        })
      })
    },
    translationClick() {
      if (this.originalLanguageValue === '') {
        this.$message({
          message: this.$t('lang.selectLang'),
          type: 'warning'
        })
        return
      }
      if (this.resultLanguageValue === '') {
        this.$message({
          message: this.$t('lang.selectTranslationLang'),
          type: 'warning'
        })
        return
      }
      if (this.originalLanguageValue !== this.resultLanguageValue) {
        if (this.translationGoalValue === '') {
          this.$message({
            message: this.$t('lang.selectTranslationContent'),
            type: 'warning'
          })
          return
        }
        this.$api.getTranslate({
          targetLanguage: this.resultLanguageValue,
          text: this.translationGoalValue
        }).then(res => {
          this.translationResultValue = res.translatedText
        })
      } else {
        this.$message({
          message: this.$t('lang.selectTranslationTip'),
          type: 'warning'
        })
      }

    },
    sendTranslateText(value) {
      if (this.loginAccount === '') {
        this.$message({
          message: this.$t('lang.notLoginTip'),
          type: 'warning'
        })
        return
      }
      ipcRenderer.send("startNewChatAndSend", {
        viewId: this.viewId,
        id: this.chatUser,
        content: value.toString()
      });
    },
    copyValue(value) {
      let input = document.createElement("input");   // 直接构建input
      input.value = value;  // 设置内容
      document.body.appendChild(input);    // 添加临时实例
      input.select();   // 选择实例内容
      document.execCommand("Copy");   // 执行复制
      document.body.removeChild(input); // 删除临时实例
      this.$message({
        message: this.$t('lang.copySuccess'),
        type: 'success',
      });
    },
    sendQuickReply(value) {
      if (this.loginAccount === '') {
        this.$message({
          message: this.$t('lang.notLoginTip'),
          type: 'warning'
        })
        return
      }
      ipcRenderer.send("startNewChatAndSend", {
        viewId: this.viewId,
        id: this.chatUser,
        content: value.toString()
      });
    }
    ,
    swapItems(arr, index1, index2) {//交换元素 --//数组,元素1，元素2
      arr[index1] = arr.splice(index2, 1, arr[index1])[0];
      return arr;
    }
    ,
    upRecord($index) {//上移
      if ($index === 0) {
        return;
      }
      this.swapItems(this.groupingSortList, $index, $index - 1);
      this.getGroupSortExchange(this.groupingSortList[$index].groupCode, this.groupingSortList[$index - 1].groupCode)
    }
    ,
    downRecord($index) {//下移
      if ($index === this.groupingSortList.length - 1) {
        return;
      }
      this.swapItems(this.groupingSortList, $index, $index + 1);
      this.getGroupSortExchange(this.groupingSortList[$index].groupCode, this.groupingSortList[$index + 1].groupCode)
    }
    ,
    groupingDialogVisibleClick(code, value) {
      this.groupingDialogVisible = true
      if (value === '') {
        this.isCreat = true
      } else {
        this.groupingCode = code
        this.groupingValue = value
        this.isCreat = false
      }
    }
    ,
    clickExpand(index, expand) {
      this.groupingSortList[index].expand = !expand
    }
    ,
    asyncOK() {
      this.loading = true
      if (this.isCreat) {
        this.getGroupCreation(this.groupingValue, this.groupingSortList.length + 1)
      } else {
        this.getGroupEdition(this.groupingCode, this.groupingValue)
      }
    }
    ,
    replyAsyncOK(boolean) {
      this.loading = true
      if (boolean) {
        this.replyGroupCode = this.replyGroupingValue
        this.getFastCreation(this.replyGroupCode, this.replyContentValue, this.replyTitleValue)
      } else {
        this.getFastEdition(this.replyFastCode, this.replyContentValue, this.replyGroupCode, this.replyTitleValue)
      }
    }
    ,
    change() {
      if (this.loginAccount === '') return
      ipcRenderer.send("updateAutoReplyStatus", {
        viewId: this.viewId,
        status: this.switchStatus
      });
      this.getSetSeatConfig(this.switchStatus ? "1" : "2")
    },
    save() {
      let parameterList = []
      for (let i = 0; i < this.userPortraitList.length; i++) {
        if (this.userPortraitList[i].type === 'CHECKBOX') {
          parameterList.unshift({
            userProfileItemKey: this.userPortraitList[i].name,
            userProfileItemValue: this.userPortraitList[i].valueList.toString()
          })
        } else {
          parameterList.unshift({
            userProfileItemKey: this.userPortraitList[i].name,
            userProfileItemValue: this.userPortraitList[i].value
          })
        }
      }
      this.$api.getUserProfileEditing({
        adminCode: localStorage.adminCode,
        seatWhatsappAccount: this.loginAccount,
        userWhatsappAccount: this.chatUser,
        list: parameterList
      }).then(res => {
        console.log(res)
        this.$message({
          message: this.$t('lang.saveSuccess'),
          type: 'success'
        })
      })
    },
    taskSave() {
      let parameterList = []
      for (let i = 0; i < this.taskUserList.length; i++) {
        parameterList.unshift({
          missionName: this.taskUserList[i].key,
          missionValue: this.taskUserList[i].value
        })

      }
      let code = this.taskList[this.currentTaskPosition].taskCode
      this.$api.getTaskMissionEdit({
        taskCode: code,
        list: parameterList
      }).then(() => {
        this.getTaskDetail(code)
        this.$message({
          message: this.$t('lang.saveSuccess'),
          type: 'successß'
        })
      })
    },
    addNewChat: function () {
      let phone = this.countriesNumber + this.phoneNumber;
      ipcRenderer.send("startNewChat", {
        viewId: this.viewId,
        phone: phone
      });
      this.phoneNumber = '';

    },
    reLoad: function () {
      ipcRenderer.send("windowreload", "");
    },
    remove: function (root, node, data) {
      const parentKey = root.find(el => el === node).parent;
      const parent = root.find(el => el.nodeKey === parentKey).node;
      const index = parent.children.indexOf(data);
      parent.children.splice(index, 1);
    },
    handleContextMenuEdit(item, isFast) {
      if (isFast) {
        this.replyFastDialogVisible = true
      } else {
        this.replyDialogVisible = true
      }
      if (item !== null) {
        this.replyTitleValue = item.fastName
        this.replyContentValue = item.content
        this.replyFastCode = item.fastCode
        this.replyGroupCode = item.groupCode
      }

    },
    handleContextMenuDelete(index, code) {
      this.$confirm(this.$t('lang.deleteReplyContent'), this.$t('lang.deleteReplyTitle'), {
        confirmButtonText: this.$t('lang.sureTxt'),
        cancelButtonText: this.$t('lang.cancelTxt'),
        center: true,
      }).then(() => {
        this.defaultSortList.splice(index, 1)
        this.getFastDelete(code)
      }).catch(() => {

      });
    },
    handleContextMenuDeleteGroup(index, childIndex, code) {
      this.$confirm(this.$t('lang.deleteReplyContent'), this.$t('lang.deleteReplyTitle'), {
        confirmButtonText: this.$t('lang.sureTxt'),
        cancelButtonText: this.$t('lang.cancelTxt'),
        center: true,
      }).then(() => {
        this.groupingSortList[index].fastReplyList.splice(childIndex, 1)
        this.getFastDelete(code)
      }).catch(() => {

      });
    },
    getUserProfile() {
      this.$api.getUserProfile({
        adminCode: localStorage.adminCode,
        seatWhatsappAccount: this.loginAccount,
        userWhatsappAccount: this.chatUser
      }).then(res => {
        this.userPortraitList = res.userProfileItem
      })
      this.getLabelsShowList()
    },
    getUserRegister(phone) {
      this.$api.getUserRegister({
        adminCode: localStorage.adminCode,
        merchantCode: localStorage.merchantCode,
        seatWhatsappAccount: this.loginAccount,
        userWhatsappAccount: this.countriesNumber + this.phoneNumber + "@c.us"
      }).then(() => {
        ipcRenderer.send("startNewChat", {
          viewId: this.viewId,
          phone: phone
        });
        this.phoneNumber = ''
      })

    },
    getSupportLanguages() {
      this.$api.getSupportLanguages({
        systemLanguageCode: localStorage.systemLanguageCode
      }).then(res => {
        if (res === null) return

        this.originalLanguageList = res.dataList
        this.resultLanguageList = res.dataList
        this.systemLanguageList = res.dataList
        this.translationLanguageList = res.dataList
        this.systemLanguageValue = localStorage.systemLanguageCode
        this.translationLanguageValue = localStorage.targetLanguageCode
      })
    },
    getFastList() {
      this.$api.getFastList({
        adminCode: localStorage.adminCode
      }).then(res => {
        if (res === null) return
        this.defaultSortList = res.dataList
      })
    },
    getFastCreation(code, content, name) {
      this.$api.getFastCreation({
        adminCode: localStorage.adminCode,
        content: content,
        groupCode: code,
        name: name
      }).then(() => {
        this.getFastList()
        this.getGroupList()
        this.replyDialogVisible = false
        this.replyFastDialogVisible = false
        this.loading = false
        this.replyTitleValue = ''
        this.replyContentValue = ''
        this.replyGroupingValue = ''
      }).catch(() => {
        this.loading = false
      })
    },
    getFastDelete(code) {
      this.$api.getFastDelete({
        fastCode: code
      }).then(() => {
        this.$message({
          type: 'success',
          message: this.$t('lang.taskDeleteSuccessTip')
        });
        this.getFastList()
        this.getGroupList()
      })
    },
    getFastEdition(code, content, groupCode, name) {
      this.$api.getFastEdition({
        adminCode: localStorage.adminCode,
        content: content,
        fastCode: code,
        groupCode: groupCode,
        name: name
      }).then(() => {
        this.$message({
          message: this.$t('lang.taskEditorSuccessTip'),
          type: 'success'
        })
        this.replyDialogVisible = false
        this.replyFastDialogVisible = false
        this.loading = false
        this.replyTitleValue = ''
        this.replyContentValue = ''
        this.getFastList()
        this.getGroupList()

      }).catch(() => {
        this.loading = false
      })
    },

    getGroupList() {
      this.$api.getGroupList({
        adminCode: localStorage.adminCode
      }).then(res => {
        if (res === null) return
        this.groupingSortList = res.dataList
      })
    },
    getGroupSortExchange(cCode, eCode) {
      this.$api.getGroupSortExchange({
        currentGroupCode: cCode,
        exchangedGroupCode: eCode
      }).then(() => {

      })
    },
    getGroupCreation(name, value) {
      this.$api.getGroupCreation({
        adminCode: localStorage.adminCode,
        groupName: name,
        sortValue: value
      }).then(() => {
        this.$message({
          message: this.$t('lang.taskCreateSuccessTip'),
          type: 'success'
        })
        this.getGroupList()
        this.groupingDialogVisible = false;
        this.loading = false
        this.defaultSort = '2'
        this.groupingValue = ''

      }).catch(() => {
        this.loading = false
      })
    },
    getGroupEdition(code, name) {
      this.$api.getGroupEdition({
        groupCode: code,
        newGroupName: name
      }).then(() => {
        this.$message({
          message: this.$t('lang.taskEditorSuccessTip'),
          type: 'success'
        })
        this.getGroupList()
        this.groupingDialogVisible = false;
        this.loading = false
        this.groupingValue = ''
      }).catch(() => {
        this.loading = false
      })
    },
    getSpecialUserTaskList() {
      this.taskBind = false
      this.$api.getSpecialUserTaskList({
        adminCode: localStorage.adminCode,
        userWaAccount: this.chatUser,
        seatWaAccount: this.loginAccount,
        pageNum: 1,
        pageSize: 1000
      }).then(res => {
        if (res === null) {
          this.taskList = []
          this.taskSize = 0
          this.taskBind = false
          return
        }

        this.taskList = res.dataList
        this.taskSize = res.dataList.length
        // this.taskBind = this.taskSize === 1
        // if (res.dataList.length === 1) {
        //     this.getTaskDetail(res.dataList[0].taskCode)
        // } else {
        for (let i = 0; i < res.dataList.length; i++) {
          if (res.dataList[i].currentTask) {
            this.taskBind = true
            this.getTaskDetail(res.dataList[i].taskCode)
          }
        }
        // }

      })
    },
    getTaskCurrentTask(index, code) {
      this.$api.getTaskCurrentTask({
        adminCode: localStorage.adminCode,
        taskCode: code,
        seatWhatsappAccount: this.loginAccount,
        userWhatsappAccount: this.chatUser
      }).then(() => {
        this.currentTaskPosition = index
        this.taskList[index].currentTask = true
        this.taskBind = true
        this.taskListDialogVisible = false
        for (let i = 0; i < this.taskList.length; i++) {
          if (i !== index) {
            this.taskList[i].currentTask = false
          }
        }
        this.activeName = 'first'
        this.taskDetail = '1'
        this.getTaskDetail(code)
      })
    },
    getTaskDetail(code) {
      this.currentTaskCode = code
      this.$api.getTaskDetail({
        taskCode: code
      }).then(res => {
        this.taskUserList = res.taskMission
      })

      this.$api.getTaskAllTypeMessage({
        taskCode: code,
        pageNum: 1,
        pageSize: 100
      }).then(res => {
        if (res === null) return
        this.taskRecordAllList = res.dataList
        this.allRecordSearchList = this.taskRecordAllList
      })
      this.$api.getTaskFileMessage({
        taskCode: code,
        pageNum: 1,
        pageSize: 100
      }).then(res => {
        if (res === null) return
        this.taskRecordFileList = res.dataList
        this.fileRecordSearchList = this.taskRecordFileList
      })
      this.$api.getTaskImageAndVideoMessage({
        taskCode: code,
        pageNum: 1,
        pageSize: 100
      }).then(res => {
        if (res === null) return
        this.taskRecordPicVideoList = res.dataList
      })
    },
    getTaskComplete(code) {
      this.$api.getTaskComplete({
        taskCode: code
      }).then(() => {
        this.taskList.splice(this.currentTaskPosition, 1)
        this.taskSize = this.taskList.length
        this.getSpecialUserTaskList()
        this.$message({
          message: this.$t('lang.taskOverSuccess'),
          type: 'success'
        })
      })
    },
    getTaskCreate() {
      this.$api.getTaskCreate({
        adminCode: localStorage.adminCode,
        merchantCode: localStorage.merchantCode,
        seatWhatsappAccount: this.loginAccount,
        userWhatsappAccount: this.chatUser,
        taskMission: this.initiateTaskContent
      }).then(res => {
        this.taskCreateCode = res
        this.getOtherAdminList()
      })
    },
    getSetSeatConfig(config) {
      this.$api.getSetSeatConfig({
        adminCode: localStorage.adminCode,
        autoReplyConfig: config
      }).then(() => {
        this.$message({
          message: this.$t('lang.AutoReply') + (this.switchStatus ? this.$t('lang.AutoReplyOpen') : this.$t('lang.AutoReplyClose')),
          type: 'success',
        })
      })
    },
    getLanguageChange(systemLanguage, targetLanguage) {
      this.$api.getSetSeatConfig({
        adminCode: localStorage.adminCode,
        systemLanguageCode: systemLanguage,
        targetLanguageCode: targetLanguage,
      }).then(() => {
      })
    },
    getAutoReplyConfigList() {
      this.$api.getAutoReplyConfigList({
        adminCode: localStorage.adminCode
      }).then(res => {
        if (res === null) return
        ipcRenderer.send("autoReplyConfig", this.viewId, res.dataList)
      })
    },
    getMessageCreation(message, flag, time, avatar, type, cType, from, to, sendAccount, name) {
      if (cType === undefined) {
        cType = ''
      }
      let param = new FormData()
      param.append('adminCode', localStorage.adminCode)
      param.append('merchantCode', localStorage.merchantCode)
      param.append('from', from)
      param.append('to', to)
      param.append('textTypeMessage', message)
      param.append('seatSendFlag', flag)
      param.append('sendDateTime', time.toString())
      param.append('senderAvatar', avatar)
      param.append('userType', type)
      param.append('contentType', cType)
      param.append('groupMemberAccount', sendAccount)
      param.append('userNickname', name)
      param.append('seatWhatsappAccount', this.loginAccount)
      console.log("上传聊天接口 开始");
      this.$api.getMessageCreation(param).then((res) => {
        console.log("上传聊天接口结果", res);
      })
    },

    recordWhatsappMsg(arg) {
      // let param = new FormData()
      // param.append('sender', sender)
      // param.append('receiver',receiver)
      // param.append('msg_content', msg_content)
      // param.append('mimetype', mimetype)
      // param.append('token', localStorage.token)
      // param.append('myWa', myWa)
      console.log("上传聊天接口 开始");
      this.$api.recordWhatsappMsg(arg).then((res) => {
        console.log("上传聊天接口结果", res);
      })
    },
  },
  mounted() {
    ipcRenderer.on('chatMessage', (event, arg) => {
      this.getMessageCreation(arg.textTypeMessage, arg.seatSendFlag, arg.sendDateTime, '', arg.userType, arg.contentType, arg.from, arg.to, arg.senderAccount, arg.senderNickName)
    })
    ipcRenderer.on('saveToken', (event, arg) => {
      localStorage.setItem("token",arg)
    })
    ipcRenderer.on('uploadImage', (event, arg) => {
      arg.stuffCode = localStorage.code
      this.recordWhatsappMsg(arg).then(() => {
        console.log(1111);
      })
    });
  },
  created() {
    this.$i18n.locale = localStorage.langValue
  },
}
</script>
<style>
.task-bind-style {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: rgba(0, 0, 0, 0.02);
  border-radius: 4px 4px 0 0;
  height: 54px;
  align-items: center;
}

.el-tabs__item {
  width: 32% !important;
  text-align: center !important;
}

.el-tabs__nav-wrap::after {
  height: 1px !important;
  background-color: #E6E6E6 !important;
}

.el-tabs__active-bar {
  height: 3px !important;
}

.el-message-box {
  width: 80% !important;
}

.item-ellipsis {
  font-size: 16px;
  color: #333333;
  width: 240px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-top: 2px;
}

.s-ellipsis {
  font-size: 13px;
  color: #333333;
  width: 150px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-left: 20px;
}

.item-bind {
  color: #999999 !important;
  font-size: 12px !important;
  border: none !important;
  width: 50% !important;
  text-align: left !important;
  margin-left: 10px;
}

.item-bind-true {
  width: 40% !important;
  text-align: left !important;
  margin-left: 10px;
  color: #3994f1 !important;
  font-size: 14px !important;
  border: none !important;
}

.item-bind-true:hover {
  color: #005eff !important;
}

.item-copy {
  color: #999999 !important;
  font-size: 12px !important;
  border: none !important;
  margin-right: 10px;
}

.item-copy:hover {
  color: #007eff !important;
}

.item-copy:active {
  border: none !important;
}

.el-radio__inner {
  width: 0 !important;
  height: 0 !important;
  border: none !important;
}


.el-radio-button__inner {
  border: none !important;
  border-radius: 4px 4px 0 0 !important;
  margin-right: 5px !important;
  background-color: #EFEFEF !important;
  color: #777777 !important;
}

.el-radio-button__orig-radio:checked + .el-radio-button__inner {
  color: #409EFF !important;
  background-color: white !important;
  -webkit-box-shadow: 0 0 0 0 white !important;
}


.tab-pane {
  color: #333333;
  background-color: #f5f5f5;
  margin-top: -16px !important;
}

.item-style {
  display: flex;
  flex-direction: column;
  margin-left: 15px;
  margin-right: 15px;
}

.chat-style {
  /*height: 60px;*/
  width: 95%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: absolute;
  margin-left: 20px;
  margin-right: 20px;
}

.horizontal-style {
  width: 50%;
  display: flex;
  flex-direction: row;
  margin-top: 20px;
}

.item-title {
  color: #333333;
  font-size: 14px;
  margin-bottom: 8px;
}

.button-save {
  width: 64px !important;
  margin-top: 4px;
  margin-left: 15px;
  color: white;
  outline: 0;
}

.button-session {
  width: 96px !important;
  margin-left: 12px;
  color: white;
  outline: 0;
}


::-webkit-scrollbar {
  width: 0 !important;
}

::-webkit-scrollbar {
  width: 0 !important;
  height: 0;
}

.demo-tree-render .ivu-tree-title {
  width: 100%;
}
</style>